import { SkerRender } from "./SkerRender";
import { ASSETS } from "./utils";

export class ToolsRender extends SkerRender {
    constructor(private onClick: (event: string) => {}) {
        super();
    }
    toolsWindow: AutoJs.FloatyWindow;
    startView: any;
    render(): void {
        this.toolsWindow = floaty.window(`<LinearLayout layout_width="wrap_content" layout_height="wrap_content" orientation="vertical">
        <com.makeramen.roundedimageview.RoundedImageView alpha="0.6" id="icon" riv_corner_radius="16dp" riv_mutate_background="true" riv_oval="true" w="42dp" h="42dp" padding="4dp" src="${ASSETS.logo}"/>
        <LinearLayout id="menu" visibility="gone" background="#ffffff" gravity="left|top" orientation="vertical" clickable="false" layout_width="wrap_content" layout_height="wrap_content">
            <com.makeramen.roundedimageview.RoundedImageView id="info" w="42dp" h="42dp" layout_gravity="center" src="${ASSETS.info}" padding="8dp" foreground="?selectableItemBackgroundBorderless"/>
            <com.makeramen.roundedimageview.RoundedImageView id="start" w="42dp" h="42dp" layout_gravity="center" src="${ASSETS.start}" padding="8dp" foreground="?selectableItemBackgroundBorderless"/>
            <com.makeramen.roundedimageview.RoundedImageView id="kill" w="42dp" h="42dp" layout_gravity="center" src="${ASSETS.kill}" padding="8dp" foreground="?selectableItemBackgroundBorderless"/>
            <com.makeramen.roundedimageview.RoundedImageView id="bug" w="42dp" h="42dp" layout_gravity="center" src="${ASSETS.bug}" padding="8dp" foreground="?selectableItemBackgroundBorderless"/>
            <com.makeramen.roundedimageview.RoundedImageView id="update" w="42dp" h="42dp" layout_gravity="center" src="${ASSETS.update}" padding="8dp" foreground="?selectableItemBackgroundBorderless"/>
            <com.makeramen.roundedimageview.RoundedImageView id="clear" w="42dp" h="42dp" layout_gravity="center" src="${ASSETS.dev}" padding="8dp" foreground="?selectableItemBackgroundBorderless"/>
        </LinearLayout>
    </LinearLayout>`)

        const mActionViewIcon = this.toolsWindow.icon;
        const mActionMenu = this.toolsWindow.menu;

        const infoView = mActionMenu.info;
        const startView = mActionMenu.start;
        this.startView = startView;

        const killView = mActionMenu.kill;
        const bugView = mActionMenu.bug;
        const updateView = mActionMenu.update;
        const clearView = mActionMenu.clear;

        let mActionMenuOpen: boolean = false;
        const onSwitchOpen = () => {
            ui.run(() => {
                mActionMenuOpen = !mActionMenuOpen;
                mActionViewIcon.attr(`alpha`, mActionMenuOpen ? `1` : `0.6`)
                mActionMenu.attr('visibility', mActionMenuOpen ? `visible` : `gone`)
                if (mActionMenuOpen) {
                    this.toolsWindow.setPosition(device.width - mActionViewIcon.getWidth(), device.height / 2 - 300)
                } else {
                    this.toolsWindow.setPosition(device.width - mActionViewIcon.getWidth() * 2 / 3, device.height / 2 - 300)
                }
            })
        }
        ui.run(() => {
            const px = this.dpToPx(42)
            this.toolsWindow.setPosition(device.width - px, device.height / 2 - 300)
            this.toolsWindow.icon?.click(onSwitchOpen)
            infoView.click(this.onInfoClick.bind(this))
            killView.click(this.onKillClick.bind(this))
            startView.click(this.onStartClick.bind(this))
            bugView.click(this.onBugClick.bind(this))
            updateView.click(this.onUpdateClick.bind(this))
            clearView.click(this.onClearClick.bind(this))
        })
    }
    dpToPx(dp: number) {
        const density = context.getResources().getDisplayMetrics().density;
        return Math.round(dp * density);
    }
    onInfoClick() {
        this.onClick('info')
    }
    onKillClick() {
        this.onClick('kill')
    }
    onStartClick() {
        this.onClick('start')
    }
    start() {
        ui.run(() => {
            this.startView?.attr('src', ASSETS.stop)
        })
    }
    stop() {
        ui.run(() => {
            this.startView?.attr('src', ASSETS.start)
        })
    }
    onBugClick() {
        this.onClick('bug')
    }
    onUpdateClick() {
        this.onClick('update')
    }
    onClearClick() {
        this.onClick('clear')
    }
}